<html>
<script>/*
$(function () {
                $('#datepicker1').datepicker();
            });
			*/</script>
<style>
table {
  border-collapse: collapse;
  border-spacing: none;
  }

thead th {
  background-color: #F7BE81;
  font-size: 12px;
  font-family: sans-serif;
  border:none;
  }

tbody td {
  font-size: 12px;
}

tr td:first-child,
tr th:first-child {
      border-top-left-radius: 6px;
      border-bottom-left-radius: 6px;
}

tr td:last-child,
tr th:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}


</style>

<div ng-app="myApp">
 <h3>Transaction Master</h3>   
 <form  novalidate name="InsTranForm" id="Ins-form" method="post" action="">  
  <table>
   <tr>
      <td>* Inward Date: </td>
	  <td><input type="date" ng-model="newtransactionmast.inwarddate" required/></td>
      <td>&nbsp;&nbsp;Proposal No: </td>
	   <td><input type="text" name="proposalno" ng-model="newtransactionmast.proposalno" capitalize/ > </td>
       <td>* Policy No: </td>
	   <td><input type="text" name="policyno" ng-model="newtransactionmast.policyno" capitalize/> </td>
    </tr>
       
     <tr>
      <td>&nbsp;&nbsp;File Barcode:</td>
	  <td><input type="text" name="filebarcode" ng-model="newtransactionmast.filebarcode" capitalize/> </td>
       <td>&nbsp;&nbsp;Carton Barcode: </td>
	  <td><input type="text" name="cartonbarcode" ng-model="newtransactionmast.cartonbarcode" capitalize/> </td>
       <td>&nbsp;&nbsp;AWB No : </td>
	   <td><input type="text" name="awbno" ng-model="newtransactionmast.awbno" capitalize/> </td>
     </tr>
    
    <tr>
      <td>* Mode :</td>
	  <td> <input type="text" name="courierid" ng-model="newtransactionmast.courierid" auto-complete ui-items="modearr" /></td>
      <td>* City: </td>
	  <td> <input type="text" name="districtid" ng-model="newtransactionmast.districtid" auto-complete ui-items="cityarr" /></td>
      <td>&nbsp;&nbsp;Comment:  </td>
 	  <td> <input type="text" name="remarks" ng-model="newtransactionmast.remarks"/></td>
    </tr>
    
    </table>
   
    <a class="btn btn-success" ng-disabled="!ed" ng-click="updtcustdata(newtransactionmast)">Update</a>
	<a class="btn" ng-click="sv(newtransactionmast)" ng-disabled="ed">Save</a>
    <a href="#/editcust/" ng-click="cancel()" class="btn">Clear</a>	
	 <input type="text" ng-model="name" class="search-query" placeholder="Search table">
	 <br/><br/>
	
            <table class="table table-striped table-condensed table-hover">
                <thead>
                    <tr>
                         <th>Tran id</th>
                         <th>Inward Date</th>
                         <th>Proposal No</th>
                         <th>Policy No</th>
                         <th>File Barcode</th>
                         <th>Carton Barcode</th>
                         <th>Mode</th>
                         <th>AWB No</th>
                         <th>City</th>
                         <th>Comment</th>
						 <th>Entered By</th>
                         <th>Del</th>
                         <th>Edit</th>
                   </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="item in canceltblmast | filter: name | orderBy:predicate:reverse | startingFrom:currentPage*pageSize | limitTo:pageSize">
                         <td>{{item.trnid}}</td> 
						
                         <td>{{item.inwarddate | date:'dd/MM/yyyy'}}</td>      
                         <td>{{item.proposalno}}</td> 
                         <td>{{item.policyno}}</td> 
                         <td>{{item.filebarcode}}</td> 
						 <td>{{item.cartonbarcode}}</td> 
                         <td>{{item.courierid}}</td> 
                         <td>{{item.awbno}}</td>
                         <td>{{item.districtid }}</td> 
                         <td>{{item.remarks}}</td>
						 <td>{{item.enteredby}}</td>												 
						  <td><a  ng-click="deletetran(item.trnid)"> <img src="glyphicons_bin.png" alt="Delete"/></td> 
                          <td><a  ng-click="edit(item)"> <img src="glyphicons_edit.png" alt="Edit"/></td> 
                    </tr>
               </tbody>
             
			
            </table>
    
             <tfoot>
             Current Page  {{currentPage+1}} of {{Math.ceil(canceltblmast.length/pageSize)}}
                    <td colspan="6">
                        <div class="pagination pull-right">
                            <ul>
                           
                <button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1"> « Prev </button>
                                
                         <li ng-repeat="n in range(canceltblmast.length)"
                                    ng-class="{active: n == currentPage}"
                                    ng-click="setPage()">
                                    <a href ng-bind="n + 1">1</a>
                                </li> 
                   
        <button ng-disabled="currentPage >= canceltblmast.length/pageSize - 1" ng-click="currentPage=currentPage+1">
        Next »
    </button>
       </li>
      </ul>
    </div>
  </td>
  </tfoot>
       </div>  
  </body>
</html>
